<template>
    <div>
        <div>
            <div style="height:30px;margin-top:3px" v-if="!disabledForStop">
                <Button type="primary" @click="handleAdd()" >录入
                </Button>
            </div>
                <Modal v-model="modalSs17006" :title="title" width="900" cancel-text="关闭" style="position:relative;">
                    <Spin v-if="LoadingModal" size="large" fix></Spin>
                    <Form ref="dataSs17006" :model="dataSs17006" :rules="rules" inline :label-width="160"
                          :disabled="disableSubmit">
                        <table style="width:100%;">
                            <tr>
                                <td style="">
                                    <FormItem label="人员姓名" prop="ssbd0001">
                                        <dictSelect :sel_val='dataSs17006.ssbd0001' dicType="service"
                                                    :bindData.sync="dataSs17006.ssbd0001" :serviceParam="serviceParam"
                                                    dictService="/api/ac/subsistence/ss17002Service/getAssistanceMemberList"
                                                    class="itemStyle" style="width: 200px"/>
                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="财产类型" prop="ssbd0002">
                                        <dictSelect :sel_val='dataSs17006.ssbd0002' dictCode="possessiontype"
                                                    :bindData.sync="dataSs17006.ssbd0002" style="width: 200px"
                                                    clearable/>
                                    </FormItem>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <FormItem label="财产明细类:" prop="ssbd0011">

                                        <!--                                        家庭经营性财产-->
                                        <div id="a">
                                            <dictSelect :sel_val='dataSs17006.ssbd0011' dictCode="operationalproperty"
                                                        v-if="operationalpropertytype"
                                                        :bindData.sync="dataSs17006.ssbd0011" style="width: 200px"
                                                        clearable/>
                                        </div>
                                        <!--                                        家庭高档消费品-->
                                        <div id="b">
                                            <dictSelect :sel_val='dataSs17006.ssbd0011' dictCode="consumergoods"
                                                        v-if="consumergoodstype"
                                                        :bindData.sync="dataSs17006.ssbd0011" style="width: 200px"
                                                        clearable/>
                                        </div>
                                        <div id="c">
                                            <!--                                        其他家庭财产-->
                                            <dictSelect :sel_val='dataSs17006.ssbd0011' dictCode="otherproperty"
                                                        v-if="otherpropertytype"
                                                        :bindData.sync="dataSs17006.ssbd0011" style="width: 200px"
                                                        clearable/>
                                        </div>
                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="财产明细类说明" prop="ssbd0012">
                                        <Input v-model="dataSs17006.ssbd0012" placeholder="" maxlength="50"
                                               style="width: 200px"/>
                                    </FormItem>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <FormItem label="财产总估值" prop="ssbd0005">
                                        <InputNumber v-model="dataSs17006.ssbd0005" placeholder="" style="width: 200px" :min="0" :max="99999999"/>
                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="是否计入个人收入" prop="ssbd0006">
                                        <dictSelect :sel_val='dataSs17006.ssbd0006' dictCode="yesorno"
                                                    :bindData.sync="dataSs17006.ssbd0006" style="width: 200px"
                                                    clearable/>
                                    </FormItem>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <FormItem label="月计入个人收入金额" prop="ssbd0007">
                                        <InputNumber v-model="dataSs17006.ssbd0007" :min="0" style="width: 200px" :max="99999999"/>
                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="计入时间范围" prop="daterange">
                                        <DatePicker type="daterange" v-model="dataSs17006.daterange"
                                                    style="width: 200px"  :editable="false"></DatePicker>
                                    </FormItem>
                                </td>
                            </tr>
                        </table>
                    </Form>
                    <div slot="footer">
                        <Button type="text" size="large" @click="modalSs17006 = false">取消</Button>
                        <template v-if="!disableSubmit">
                            <Button type="primary" size="large" @click="handleSubmit('dataSs17006')">确定</Button>
                        </template>
                    </div>
                </Modal>

            <div style="margin-top: 10px">
                <Table :columns="columns" :data="tableData" :loading="Loading" border >
                    <template slot-scope="{ row, index }" slot="action">
                        <Button type="info" size="small" @click="handleEdit(index)" style="margin-right:5px" :disabled="disabledForStop" v-if="!disabledForStop">编辑</Button>
                        <Button type="error" size="small" @click="handleDelete(row.id)" style="margin-right: 5px" :disabled="disabledForStop" v-if="!disabledForStop">删除
                        </Button>
                        <Button type="success" size="small" @click="handleDetail(index)" style="margin-right:5px">详情
                        </Button>
                    </template>
                </Table>
                <div style="margin: 10px;overflow: hidden">
                    <div style="float: right;">
                        <Page :total="dataCount" :page-size="pageSize" show-total class="paging"
                              @on-change="handleTableChange" :current="pageNo"   ></Page>
                    </div>
                </div>
            </div>
        </div>
        <div style="height:40px;line-height:40px;margin-top:10px;text-align: center">
            <Button @click="prevStep">上一步</Button>
            <Button type="primary" @click="nextStep()" :loading="btnLoading" style="margin-left:20px">下一步</Button>
        </div>
    </div>
</template>
<script>
  import { getCityDBAppraising } from '@/api/subsistenceAlowances'
  import { date2str, iteminf, updateOrder } from '@/api/eventlist'
  import { CommonMixin } from '@/views/common/js/CommonMixin'
  import dictSelect from '@/components/dictSelect/dictSelect.vue'
  import { postAction } from '@/api/request'
  import DateFormat from '@/plugins/format.js'

  export default {
    created () {
      let that = this
      that.familyInfo = that.$parent.familyInfo
      that.ss17001Id = that.familyInfo.ss17001Id
      that.queryParam.azcp0500 = that.familyInfo.ss17001Id
      this.loadData()
      that.serviceParam.azcp0500 = that.familyInfo.ss17001Id
        //如是停救，operationType=300,则页面不可编辑
        if(that.$parent.familyInfo.ssca0016=='300'||that.$parent.familyInfo.ssca0016=='500'||that.$parent.familyInfo.ssca0016=='501'){
            that.disabledForStop = true
        }else if(that.$parent.familyInfo.yjab0012=='01'||that.$parent.familyInfo.yjab0012=='02'||that.$parent.familyInfo.yjab0012=='04'){
          //预警处置 已处置、维持现状 不可编辑数据
          that.disabledForStop = true
        }
    },
    mixins: [CommonMixin],
    components: {
      dictSelect,
    },
    data () {
      return {
          title: '',
          disabledForStop: false,
          LoadingModal: false,
          dataCount: 0,
        otherpropertytype: false,
        operationalpropertytype: true,
        consumergoodstype: false,
        ssbd0011type: '',
        ss17001Id: '',
        familyInfo: {},
        dataSs17006: {},
        serviceParam: {
          azcp0500: ''
        },
        queryParam: {},
        disableSubmit: false,
        modalSs17006: false,
        tableData: [],
        btnLoading: false,
        Loading: false,
        family_url: '',
        support_id: '',
        family_idInfo: {},
        next_params: {},
        itemid: this.$route.params.itemid || '',
        property_url: '',
        info_url: '',
        see: this.$route.params.see || false,
        code: this.$route.params.code,
        url: {
          list: '/api/ac/subsistence/ss17006Service/getPageList',
          delete: '/api/ac/subsistence/ss17006Service/deleteData'
        },
        str: this.$route.params.serialNumber,
        idcardNumber: this.$route.params.idcardNumber,
        columns: [
          {
            title: '人员姓名',
            align: 'center',
            key: 'ssbd0001_name'
          },
          {
            title: '财产类型',
            align: 'center',
            key: 'ssbd0002_name'
          },
          {
            title: '财产总估值',
            align: 'center',
            key: 'ssbd0005'
          },
          {
            title: '是否计入个人收入',
            align: 'center',
            key: 'ssbd0006_name'
          },
          {
            title: '计入开始时间',
            align: 'center',
            key: 'ssbd0009',
            render: (h, params) => {
              let value = params.row.ssbd0009
              if (typeof (value) === 'undefined' || value === null || value === '' || value === undefined) {
                value = '--'
              } else {
                value = DateFormat(value, 'YYYY-MM-DD')
              }
              return h('span', value + ' ')
            }
          },
          {
            title: '计入结束时间',
            align: 'center',
            key: 'ssbd0010',
            render: (h, params) => {
              let value = params.row.ssbd0010
              if (typeof (value) === 'undefined' || value === null || value === '' || value === undefined) {
                value = '--'
              } else {
                value = DateFormat(value, 'YYYY-MM-DD')
              }
              return h('span', value + ' ')
            }
          },
          {
            title: '月计入个人收入金额',
            align: 'center',
            key: 'ssbd0007',
            render: (h, params) => {
              let value = params.row.ssbd0007
              if (typeof (value) === 'undefined' || value === null || value === '' || value === undefined) {
                value = '--'
              }
              return h('span', value + ' ')
            }
          },
          {
            title: '操作',
            slot: 'action',
            align: 'center',
            width: '200px',
            fixed:'right'
          }
        ],
        fieldsToValidate02: ['ssbd0001', 'ssbd0002', 'ssbd0011', 'ssbd0012', 'ssbd0005', 'ssbd0006', 'ssbd0007', 'daterange'],
        rules: {
          ssbd0001: [
            { required: true, message: '请输入"人员姓名"', trigger: 'blur' }
          ],
          ssbd0002: [
            { required: true, message: '请选择"财产类型"', trigger: 'blur' }
          ],
          ssbd0011: [
            { required: true, message: '请选择"财产明细类"', trigger: 'blur' }
          ],
          ssbd0012: [
            { required: true, message: '请输入"财产明细类说明"', trigger: 'blur' }
          ],
          ssbd0005: [
            { required: true, message: '请输入"财产总估值"', trigger: 'blur', type: 'number' }
          ],
          ssbd0006: [
            { required: true, message: '请选择"是否计入个人收入"', trigger: 'blur' }
          ],
          daterange: [
            { required: true, message: '请选择计入时间范围', trigger: 'change', pattern: /.+/ }],
          ssbd0007: [
            { required: true, message: '请输入"月计入个人收入金额"', trigger: 'blur', type: 'number' }
          ],

        },
        possessiontype: [],
      }
    },
    watch: {
        "dataSs11006.ssbd0002": function (value,oldVal) {
            let that = this;
            if(oldVal){
                that.dataSs11006.ssbd0011 = undefined;
            }
        if (value == '200') {
          that.operationalpropertytype = true
          that.consumergoodstype = false
          that.otherpropertytype = false
        } else if (value == '300') {
          that.operationalpropertytype = false
          that.consumergoodstype = true
          that.otherpropertytype = false
        } else if (value == '900') {
          that.operationalpropertytype = false
          that.consumergoodstype = false
          that.otherpropertytype = true
        }
      }
    },
    methods: {
      prevStep () {
        this.$emit('prevStep')
      },
      nextStep () {
        let that = this
        this.$emit('nextStep')
      },
      nextPage () {
        this.$router.push({
          name: 'db_houseproperty',
          params: this.next_params
        })
      },
      handleAdd () {
        this.$refs['dataSs17006'].resetFields()
        let that = this
        that.title = '录入'
        that.disableSubmit = false
        that.modalSs17006 = true
        that.dataSs17006 = new Object()
        that.dataSs17006.ssbd0009 = undefined
        that.dataSs17006.ssbd0010 = undefined
        that.dataSs17006.ssbd0005 = null
        that.dataSs17006.ssbd0007 = null

      },
      handleEdit (index) {
        let that = this
        that.title = '编辑'
        that.disableSubmit = false
        let record = that.tableData[index]
        if (record.id) {
          that.modalSs17006 = true
          that.dataSs17006 = Object.assign({}, record)
          that.dataSs17006.daterange = new Array()
          that.dataSs17006.daterange.push(new Date(record.ssbd0009))
          that.dataSs17006.daterange.push(new Date(record.ssbd0010))
        } else {
          that.modalSs17006 = false
        }
      },
      handleDetail (index) {
        let that = this
        that.title = '详情'
        that.disableSubmit = true
        let record = that.tableData[index]
        if (record.id) {
          that.modalSs17006 = true
          that.dataSs17006 = Object.assign({}, record)
          that.dataSs17006.daterange = new Array()
          that.dataSs17006.daterange.push(new Date(record.ssbd0009))
          that.dataSs17006.daterange.push(new Date(record.ssbd0010))
        } else {
          that.modalSs17006 = false
        }
      },
      handleSubmit (name) {
        let that = this
          that.LoadingModal = true;
        let validate = true
        let err_msg = []
        for (let item of that.fieldsToValidate02) {
          that.$refs[name].validateField(item, (error) => {
            if (error) {
              validate = false
              err_msg.push(that.rules[item][0].message)
            }
          })
        }
        if (validate) {
          let dataParam = {}
          that.Loading = true
          dataParam = Object.assign({}, that.dataSs17006)
          let url = '/api/ac/subsistence/ss17006Service/createData'
          if (dataParam.id != null) {
            url = '/api/ac/subsistence/ss17006Service/updateData'
          }
          dataParam.ssbd0009 = DateFormat(dataParam.daterange[0], 'YYYY-MM-DD')
          dataParam.ssbd0010 = DateFormat(dataParam.daterange[1], 'YYYY-MM-DD')
          postAction(url, dataParam).then((res) => {
            if (res.data.errcode != 0) {
              this.$Message.error(res.data.errmsg)
            } else {
              this.modalFormOk()
              this.modalSs17006 = false
            }
          }).finally(() => {
            that.Loading = false
              that.LoadingModal = false;
          })
        } else {
            that.LoadingModal = false;
          that.$Message.error(err_msg[0])
          return
        }
        // })
      },
      next () {
        this.$router.push({
          name: 'db_houseproperty',
          params: this.next_params
        })
      },
    },
    mounted () {

    }
  }
</script>

<style scoped>
    /deep/ .ivu-form-item-error-tip {
        display: none;
    }

    .ivu-form-item {
        margin-bottom: 0px;
    }

    .itemStyle {
        width: 180px
    }
</style>
<style scoped>
    /deep/ .ivu-form-item-error-tip {
        display: none;
    }

    .ivu-form-item {
        margin-bottom: 0px;
    }

    .itemStyle {
        width: 180px
    }

    .head-img1 {
        height: 200px;
        width: 250px;
        margin-top: 15px;
    }

    .head-img {
        height: 200px;
        width: 250px;
    }

    .imgBackColor {
        background-color: WhiteSmoke;
        height: 250px;
    }

    .positiveTDiv {
        height: 240px;
        width: 75px;
        line-height: 240px;
        background-color: #7CCD7C;
        margin-bottom: 10px;
        color: white;
        font-size: 14px;
        font-weight: 700;
    }
</style>
